---
import { faQuoteRight } from "@fortawesome/free-solid-svg-icons";
import FontAwesomeIcon from "../FontAwesomeIcon.astro";
---

<div class="card card-hover relative inline-block mb-8 w-full">
  <FontAwesomeIcon
    icon={faQuoteRight}
    class="absolute text-primary/10 !h-24 w-24 -top-4 -left-1 rotate-180"
  />
  <div class="flex flex-col h-full">
    <p class="text-base mb-6 flex-grow">
      {Astro.props.testimonial}
    </p><div class="border-t pt-4">
      <div class="flex flex-row">
        <div class="flex-grow">
          <p class="font-semibold">{Astro.props.name}</p>{
            Astro.props.description ? (
              <p class="text-sm text-muted-foreground">
                {Astro.props.description}
              </p>
            ) : (
              ""
            )
          }
        </div>
        <div>
          <a href={Astro.props.sourceLink} target="_blank" aria-label="Source">
            <FontAwesomeIcon
              icon={Astro.props.sourceIcon}
              class="inline-block w-6 !h-6 self-center"
            />
          </a>
        </div>
      </div>
    </div>
  </div>
</div>
